<template>
  <div>
    <p>useNow: {{ now }}</p>
    <hr/>
    <p>useTimestamp: {{ time }}</p>
    <p>useTimeAgo: {{ timeAgo }}</p>
    <p>useDateFormat: {{ formatted }}</p>
  </div>
</template>

<script setup>
import { useNow, useTimestamp, useTimeAgo, useDateFormat } from '@vueuse/core'
// import { ref } from 'vue'

const now = useNow()
const timeAgo = useTimeAgo(now)
const formatter = 'YYYY-MM-DD HH:mm:ss'
const formatted = useDateFormat(now, formatter)
const time = useTimestamp().value - 60 * 60 * 100
</script>
